<template>
    <div>
        <Modal width="820"
               v-model="modal.editTimetableFlag"
               @on-cancel="cancel"
               title="编辑课程">
            <div class="modalDiv"></div>
            <Form ref="teacher" :model="modal.teacher" inline :label-width="100">
                <FormItem prop="code" label="课程代码">
                    <Input class="myform" v-model="modal.course.code" clearable/>
                </FormItem>
                <FormItem prop="grade" label="年级">
                    <Input class="myform" v-model="modal.course.grade" clearable/>
                </FormItem>
                <FormItem prop="collegeId" label="学院">
                    <Select v-model="modal.course.collegeId" clearable class="myform">
                        <Option  v-for="item in modal.list" :value="item.collegeId" :key="item.collegeId">{{item.name}}</Option>
                    </Select>
                </FormItem>
                <FormItem prop="name" label="课程名称">
                    <Input class="myform" v-model="modal.course.name" clearable/>
                </FormItem>
                <FormItem prop="collegeSystem" label="开课院系">
                <Input class="myform" v-model="modal.course.department" clearable/>
                </FormItem>
                <FormItem prop="period" label="学时">
                    <Input class="myform" v-model="modal.course.period" clearable/>
                </FormItem>
                <FormItem prop="point" label="学分">
                    <Input class="myform" v-model="modal.course.point" clearable/>
                </FormItem>
                <FormItem prop="status" label="状态">
                    <Input class="myform" v-model="modal.course.status" clearable/>
                </FormItem>
                <FormItem prop="remark" label="备注">
                    <Input class="myform" v-model="modal.course.remark" clearable/>
                </FormItem>
            </Form>
            <Button type="primary" slot="footer" @click="ok" :loading="loading">提交</Button>
        </Modal>
    </div>
</template>

<script>

    export default {
        name: "editTimetable",
        props: {
            modal: {
                editTimetableFlag: false,
                course:{},
                list:[]
            }
        },
        data() {
            return {
                loading: false,
            }
        },
        methods: {
            ok() {
                    this.loading = true
                    console.log(this.modal.course)
                    this.http.put('/course/saveEditCourse', this.qs.parse(this.modal.course)).then(res => {
                        if (res) {
                            this.$Message['success']({
                                background: true,
                                content: '编辑成功'
                            });
                            this.modal.editTimetableFlag = false;
                            this.loading = false;
                            this.$parent.getAllTimetable();
                        }
                    }).finally(r=>{
                        this.loading = false
                    })
            },
            cancel() {

            },
        },
        created() {
        }
    }
</script>

<style scoped>
    .myform {
        width: 280px;
    }
</style>